<%@ include file="/WEB-INF/common/taglibs.jsp"%>
<script type="text/javascript" src="${ctx}/resources/js/datatable-query.js"></script>
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib prefix="codec" uri="/WEB-INF/tld/codec.tld"%>




		<div class="row-fluid">
<div class="box">
					<div class="title">
 						<h4>
							<span class="icon16 icomoon-icon-filter"></span> <span>Filter</span>
						</h4>
						<a href="#" class="minimize">Minimize</a>
					</div>
					<div class="content clearfix form-horizontal">

						<div class="form-row row-fluid">
							<div class="span4">
								<label class="form-label span6">Order Id</label> <input
									class="span6 filterdata" type="text" field="orderId" op="cn" />
							</div>
							<div class="span4">
								<label class="form-label span6">Token Id</label> <input
									class="span6 filterdata" type="text" field="token" op="cn" />
							</div>
							
							<div class="span4">
								<label class="form-label span6">Email </label> <input
									class="span6 filterdata" type="text" field="purchaser.email" op="cn" />
							</div>
						</div>

						<div class="form-row row-fluid">
							<div class="span4">
								<label class="form-label span6">Status</label>
								<div class="span6 controls">
										<select field="orderStatus" class="filterdata" op="eq">
										<option value="">====================</option>
										 <c:if
														test="${not empty orderStatuses}">
														<c:forEach var="single" items="${orderStatuses}">
															<option value="${single}">${single}</option>
														</c:forEach>
										</c:if>

									</select>
								</div>
							</div>
							<div class="span4">
							 
								<label class="form-label span6">Total Money</label>
								 <input
									class="span6 filterdata" type="text" field="totalMoney" op="gt" />
						 
							</div>
 						</div>
						<div class="form-row row-fluid">
							<div class="span4">
								<label class="form-label span6">Date added From</label> <input
									class="filterdata span6 datepicker" type="text" field="dateAdd" op="ge" />
							</div>
								<div class="span4">
								<label class="form-label span6">Date added To</label> <input
									class="filterdata span6 datepicker" type="text" field="dateAdd" op="le" />
							</div>
							<div class="span4">
								<label class="form-label span6">Last modify</label> <input
									class="filterdata span6 datepicker" type="text" field="lastTransation" op="ge" />
							</div>
						</div>
						<hr />


					</div>
				</div>
		 
		 
		</div>

<div class="row-fluid">
		<div class="span12">
			<div class="box gradient">
				<div class="title">
					<h4><span>Pay Order</span>
					<span class="box-form right">
				 	<a href="${ctx}/admin/pay-order/create/"  class="btn btn-mini">Create</a>
 						</span>
					</h4>
					<a href="#" class="minimize">Minimize</a>
				</div>
				<div class="content scrollable clearfix">
					<table class="ajaxTable display table table-bordered">
						<thead>
							<tr>
								<th><a id="select_all"><span class="icomoon-icon-checkmark-2"></span></a></th>
								<th>Order Id </th>
								<th>GateWay</th>
								<th>CCY </th>
								<th>Token </th>
								<th>Total Money </th>
								<th>Date Added</th>
								<th>Date Modify</th>
								<th>Purchase Email</th>
 								<th>Status</th>
								<th>Action </th>
							</tr>
						</thead>
					</table>
				</div>
			</div>
			
</div>
</div> 

<script type="text/javascript">
$(document).ready(function () {
	johnny.oTable = $('.ajaxTable').dataTable({
		"bLengthChange": true,
		"aoColumnDefs" : [ {
			'bSortable' : false,
			'aTargets' : [ 0,9 ]
		} ],
		"sAjaxSource": '${ctx}/admin/pay-order/',
		"fnInitComplete": function (oSettings, json) { }
	});
	var name = $("<input>").attr({
		type: "text",
		field: "orderId",
		op: "cn",
		placeholder: "order Id",
		class: "filterdata"
	});
//	johnny.initTableQuery(name);
	johnny.initTableQuery()
	var config = {
			id : 'del',
			text  : 'Del',
			domain : "Banner",
			operation : "Delete",
			url : "${ctx}/admin/banner-group/del/"
	};
//	johnny.tableBtn(config);

	});


var columnHeader = ['','orderId', 'ccy', 'token', 'totalMoney','dateAdd','lastTransation','purchaser.email','status'];
var QueryData = function (aoData) {
	return johnny.initQueryData(aoData, columnHeader);
}

var DataTableForm = function (json, echo) {
	var dataArray = new Array();
	for (var i = 0; i < json.result.length; i++) {
		var subArray = new Array();
		var value = johnny.getForSelect(json.result[i].id);
 		subArray.push(value);
		var link = "${ctx}/admin/pay-order/"+json.result[i].id+"/edit/";
		subArray.push(json.result[i].orderId);
		if (json.result[i].paymentGateway){
			subArray.push(json.result[i].paymentGateway.name);			
		}else{
	 		subArray.push("");
		}
 		subArray.push(json.result[i].ccy);
		subArray.push(json.result[i].token);
		subArray.push(json.result[i].totalMoney);
		subArray.push(json.result[i].dateAdd);
		subArray.push(json.result[i].lastTransation);
		if (json.result[i].purchaser){
		subArray.push(json.result[i].purchaser.email);
		}else{
		subArray.push("");			
		}
		subArray.push(json.result[i].status);
		subArray.push(johnny.getEditHtml(link));
		dataArray.push(subArray);
	}
	return {
		sEcho: echo,
		iTotalRecords: json.totalCount,
		iTotalDisplayRecords: json.totalCount,
		aaData: dataArray
	};
}
</script>